<template>
  <div>
    <!-- 顶部返回 -->
      <van-sticky>
      <van-nav-bar
        title="不凡"
        left-text="返回"
        left-arrow
        @click-left="onClickLeft"
      />
    </van-sticky>




    <van-list
      v-model="loading"
      :finished="finished"
      finished-text="没有更多了"
      @load="onLoad"
    >
      <ul>
        <li v-for="item in list" :key="item.id">
           <router-link :to="`/home/brand/${item.id}`" tag="div">
                <img :src="item.app_list_pic_url" alt="" />
          <p >{{item.name}}丨{{item.floor_price}}元起</p>
           </router-link>
                
          

            
         
        </li>
      </ul>
    </van-list>
  </div>
</template>

    <script>
import { brand } from "@/api/home/brand/index.js";
export default {
  data() {
    return {
      list: [],
      loading: false,
      finished: false,
      start: 1,
    };
  },
  computed: {},
  created() {},

  mounted() {},
  methods: {
        onClickLeft() {
      
      this.$router.go(-1)
       
     
    },
    onLoad() {
      brand({
        page: this.start,
      }).then((res) => {
        console.log(res);
        this.list.push(...res.data);
        this.loading = false;
        this.start++;
        if (this.start > res.total) {
          this.finished = true;
        }
      });
    },
  },
};
</script>

    <style scoped lang="scss">
    li{
        position: relative;
    }
    img{
        width: 100%;
    }
    p{
        
        color: #fff;
        font-size: 17px;
        font-weight: bold;
        float: left;
        text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate3d(-50%,-50%,0);
        
    }
</style>
